<template>
    <van-swipe :autoplay="3000" lazy-render style="width:300px;">
        <van-swipe-item v-for="image in images" :key="image">
            <img :src="image" />
        </van-swipe-item>
    </van-swipe>
</template>


<script setup>
const images = [
    './src/assets/images/01.jpg',
    './src/assets/images/02.jpg',
    /*'./src/assets/images/03.jpg',
    './src/assets/images/04.jpg',*/
]
</script>

<style>
.van-swipe .van-swipe-item {
    color: #fff;
    font-size: 20px;
    line-height: 150px;
    text-align: center;
}

.van-swipe-item img {
    width: 100%;
    height: 200px;
    display: block;
    box-sizing: border-box;
    padding: 30px 60px;
}

.van-swipe__indicator {
    background-color: black !important;
}

.van-swipe__indicator--active {
    background-color: #1989fa !important;
}
</style>